<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    h1{color: red;
       color: #00ff00;
       color: #00f;
       color: rgb(255,255,0);
       color: rgba(255,0,255,0.6);
    }
    .d1{
       width: 200px;height: 200px;
       background-color: purple;
       background-image: url("../imgs/a.jpg");
       background-size: 100px 100px;
       background-repeat: no-repeat;
       background-position: 20px 20px;
       background-position: 50% 20%;
    }
    .d2{
       width: 611px; height: 376px;
       background-color: #e8e8e8;
       background-image: url("http://doc.canglaoshi.org/tstore_v1/images/itemCat/study_computer_img1.png");
       background-size: 318px 319px;
       background-repeat: no-repeat;
        /*控制位置:横向x  纵向y 通过百分比*/
       background-position: 90% 60%;
    }
  </style>
</head>
<body>
<div class="d2"></div>
<div class="d1">背景测试</div>
<h1>颜色测试</h1>
</body>
</html>